<template>
  <el-cascader
    :options="options"
    :props="props"
    @change="setClass"
    placeholder="请选择分类"
  ></el-cascader>
</template>

<script>
import {listDaflgl} from "@/api/system/daflgl";

export default {
  data() {
    return {
      options: [],
      props: {
        lazy: true,
        lazyLoad: this.lazyLoadData
      },
    };
  },
  created() {
    this.getList(0);
  },
  methods: {
    getList(classNum) {
      let queryParams = {fid: classNum};
      listDaflgl(queryParams).then(response => {
        this.options = response.data.map(item => ({
          value: item.id,
          label: item.name,
        }))
      });
    },
    lazyLoadData(node, resolve) {
      if (node.level > 0) {
        let queryParams = {fid: node.value};
        listDaflgl(queryParams).then((response) => {
          const children = response.data.map((item) => ({
            value: item.id,
            label: item.name,
            leaf: node.level > 1
          }));
          // 通过调用 resolve 将子节点数据返回，通知组件数据加载完成
          resolve(children);
        });
      }
    },
    setClass(value) {
      this.$emit("child-value-change", value[value.length-1]);
    },
  }
};
</script>
